<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="header.jsp"%>
		<div class="flex-container">
			<%@ include file="leftmenu.jsp"%>
		<div class="right-container">
			    <div class="right_content">
			    	<div class="header">
			    		<img src="images_c/location.png" />
			    		<h6>首页<span class="relation_symbol">>用户权限></span><span class="relation_color">权限管理</span></h6>
			    	</div>
			    	<div class="tab_content" id="tab_content_enterprise">
				    	<div class="row table_container">
				    		<div class="row search_result">
				    			<div class="search_result_left">
				    				<div class="search_result_icon"></div>
				    			    <p class="search_result_label">查询结果</p>
				    			</div>
				    		</div>
				    		<div class="table_block">
				    			<div class="table_block_report">
					    			<table id="report_table" class="table table-center table-striped table-bordered table-hover"
									cellspacing="0" width="3000px">
						    			<thead>
						    				<tr>
						    					<th>序号</th>
						    					<th>角色名称</th>
						    					<th>创建时间</th>
						    					<th>描述</th>
						    					<th>操作</th>
						    				</tr>
						    			</thead>
						    			<tbody>
						    			<c:if test="${not empty roles}">
											<c:forEach var="roles" items="${roles}" varStatus="ts">
												<tr>
													<td>${ts.index+1 }</td>
													<td>${roles.ROLE_NAME}</td>
													<td>${roles.CREATETIME}</td>
													<td>${roles.ROLE_DETAIL}</td>
													<td><a href="javascript:void(0);" onclick="getrole(this)"  roleid="${roles.ROLE_ID}"
													 rolename="${roles.ROLE_NAME}">权限设置</a></td>
																										
													<%-- <td>${country.continent}</td>
													<td>${country.economicZone}</td> --%>
												</tr>
											</c:forEach>
										</c:if>
						    			</tbody>
						    		</table>
				    			</div>
					    		
					    	</div>
				    	</div>
			    	</div> 
			    	<!--弹窗开始-->
				    	<div class="background" id="bg" style="display: none;">
				    		<div class="tanchuang" style="width: 700px;">
				    		    <div class="tanchuang_header">
				    		    <div class="tanchuang_title">
									<img src="images_c/tanchuang_chaxun.png" />
									<p class="tanchuang_title_name">角色权限处理</p>
								</div>
								<img src="images_c/tanchuang_close.png" class="close"/>
								
								</div>
								<div class="tanchuang_line"></div>
								<div class="tanchuang_content">
									<div class="form_group">
									<ul id="treeDemo" class="ztree" style="height:auto"></ul>
									<label class="tanchuang_label">&nbsp;</label>
									<div class="btn_group">
											<a class="tanchu_btn tanchu_btn_color1" onclick="submit()">提交</a>
											<a id="cancel_btn" class="tanchu_btn tanchu_btn_color2">取消</a>	
									</div>
									</div>
				
								</div>
							</div>
						</div>
						<!--弹窗结束-->  
			    </div>
			</div>
			<script type="text/javascript">
			var role_id;
			var role_name;
			var zNodes;
			var setting = {
					check: {
						enable: true
					},
					data: {
						simpleData: {
							enable: true
						}
					}
				};
			 function searchInput() {
				 $("#pageform").submit();
			    }
			 function getrole(obj){	
				    var thisObj=$(obj);
					role_id= thisObj.attr("roleid");  //获取当前role_id
					role_name=thisObj.attr("rolename");
					$.ajax({
						url : "<%=request.getContextPath()%>"
						+ '/role/showRoleMenu',
						type : "get",
						data:{"role_id":role_id},
						dataType:"json",
						async : false,
						success : function(data) {
							zNodes= data;
							$.fn.zTree.init($("#treeDemo"), setting, zNodes);
							setCheck();
							$('.tanchuang_title_name').text(role_name);
							$(".background").fadeIn();
						},
						error : function(data){	
						}});
					
			 }
			$(document).ready(function(){
			 	$('.close').click(function() {
					$('.background').fadeOut();
				});
				$('#cancel_btn').click(function(){
					$('.background').fadeOut();
				});
			});
			var zTree;
			function setCheck() {
			zTree = $.fn.zTree.getZTreeObj("treeDemo"),
				type = { "Y": "ps", "N": "ps"};
				zTree.setting.check.chkboxType = type;
			}
			function submit(){
				var selectedNode = zTree.getCheckedNodes();
				
				var mynodes=new Array();
				selectedNode.forEach(function(i,index){
					var node={"id":i.id,"pId":i.pId,"checked":i.checked,"open":i.open,"name":i.name};
					mynodes.push(node);
				})
				$.ajax({
					url : "<%=request.getContextPath()%>"
					+ '/role/insertRoleMenu',
					type : "get",
					data:{"nodes":JSON.stringify(mynodes),"role_id":role_id},
					contentType : "application/json",
					async : false,
					success : function(data) {
						alert("权限已修改！")
						$('.background').fadeOut();
					},
					error : function(data){	
					}});
			}
			</script>